<template>
  <!--设备档案-->
  <div style="width: 1450px">
    <el-card class="box-card">
      <div style="
          display: flex;
          align-items: center;
          justify-content: space-between;
          padding: 20px;
        ">
        <div>
          <el-button @click="add">新增</el-button>
          <el-button>编辑</el-button>
          <el-button>删除</el-button>
          <el-button style="margin-left: 15px">入库</el-button>
          <el-button style="margin-left: 15px">出库</el-button>
          <el-button style="margin-left: 15px">导入</el-button>
          <el-button style="margin-left: 15px">导出</el-button>
        </div>
        <div>
          <el-input placeholder="请输入设备编号或名称" clearable prefix-icon="el-icon-search" suffix-icon="el-icon-s-cale"
            style="width: 250px" />
          <el-popover placement="right" width="400" trigger="click">
            <svg-icon icon-class="caiss" style="width: 40px; height: 20px" class="pointer" slot="reference" />
          </el-popover>
        </div>
      </div>
      <div>
        <el-table :data="tableData" stripe style="width: 100%" size="mini">
          <el-table-column fixed type="selection" width="55" style="text-align: center"
            align="center"></el-table-column>
          <el-table-column fixed type="index" label="序号" width="50" style="text-align: center" align="center">
            <template slot-scope="scope">
              {{ scope.$index + 1 }}
            </template>
          </el-table-column>
          <el-table-column fixed label="操作" width="100" style="text-align: center" align="center">
            <template slot-scope="scope">
              <el-button type="text" size="small" style="text-align: center" @click="cha">查看</el-button>
            </template>
          </el-table-column>
          <el-table-column prop="code" label="备件编码" style="text-align: center" width="180"
            align="center"></el-table-column>
          <el-table-column prop="name" label="备件名称" style="text-align: center" width="150px"
            align="center"></el-table-column>
          <el-table-column prop="type" label="备件类型" style="text-align: center" width="150px"
            align="center"></el-table-column>
          <el-table-column prop="specification" label="规格型号" style="text-align: center" width="150px"
            align="center"></el-table-column>
          <el-table-column prop="unit" label="单位" style="text-align: center" width="150px"
            align="center"></el-table-column>
          <el-table-column prop="brand" label="品牌" style="text-align: center" width="150px"
            align="center"></el-table-column>
          <el-table-column prop="manufacturer" label="生产厂商" style="text-align: center" width="150px"
            align="center"></el-table-column>
          <el-table-column prop="vendor" label="供应商" style="text-align: center" width="200px"
            align="center"></el-table-column>
          <el-table-column prop="inventoryLimit" label="库存上限" style="text-align: center" width="150px"
            align="center"></el-table-column>
          <el-table-column prop="inventoryMinimum" label="库存下限" style="text-align: center" width="150px"
            align="center"></el-table-column>
          <el-table-column prop="cycle" label="更换周期" style="text-align: center" width="150px"
            align="center"></el-table-column>
          <el-table-column prop="indicativePrice" label="参考单价" style="text-align: center" width="130px"
            align="center"></el-table-column>
          <el-table-column prop="list[0].openingInventory" label="当前库存" style="text-align: center" width="190px"
            align="center">
          </el-table-column>
          <el-table-column prop="list[0].openingTotals" label="库存金额" style="text-align: center" width="130px"
            align="center">
          </el-table-column>
          <el-table-column prop="manufacturer" label="备注" style="text-align: center" width="130px"
            align="center"></el-table-column>
        </el-table>
      </div>
      <div style="text-align: right; margin: 20px">
        <el-pagination background :current-page.sync="currentPage" :page-size="pageSize" :total="total"
          layout="prev, pager, next, sizes, total" :page-sizes="[10, 20, 30, 50]" @size-change="handleSizeChange"
          @current-change="handleCurrentChange" />
      </div>
    </el-card>
  </div>
</template>
<script>
import { SelectLedger2, SelectLedger } from "@/api/eastjet-maintenance/tai/tai";
export default {
  name: "App",
  data() {
    return {
      //查看二维码
      dialogVisible: false,
      deviceInfo: [
        { label: "设备编号", value: "M123456" },
        { label: "设备名称", value: "数控车床" },
        { label: "规格型号", value: "CK6150" },
        { label: "设备类型", value: "车床设备" },
        { label: "存放位置", value: "车间B区" },
      ],
      qrCodeUrl: "https://via.placeholder.com/150", // 替换为真二维码
      tableData: [],
      currentPage: 1,
      pageSize: 10,
      total: 45,
    };
  },
  created() {
    this.getList();
  },
  methods: {
    //修改时间格式
    getList() {
      SelectLedger().then(res => {
        this.tableData = res.data.data.list
        this.tableData.forEach(item => {
          for (let i = 1; i < item.list.length; i++) {
            item.list[0].openingTotals += item.list[i].openingTotals
            item.list[0].openingInventory += item.list[i].openingInventory
          }
        })
        this.total = res.data.data.total
        console.log("设备数据", res.data.data)
      })
    },
    cha() {
      this.$router.push({ path: "/sb/dang/an/select" });
    },
    handlePrint() {
      alert("打印功能");
    },
    handleSizeChange(size) {
      this.pageSize = size;
      console.log(`每页 ${size} 条`);
    },
    handleCurrentChange(page) {
      this.currentPage = page;
      console.log(`当前页: ${page}`);
    },
    add() {
      this.$router.push({ path: "/bei/tai/xin" });
    },
  },
};
</script>
<style scoped>
.dialog-footer {
  text-align: right;
}

.pointer:hover {
  cursor: pointer;
  /*光标呈现为指示链接的指针（一只手）*/
}

.text {
  font-size: 14px;
}

.item {
  padding: 18px 0;
}

.box-card {
  width: 1280px;
  /* height: 620px; */
  margin-left: 25px;
  margin-top: 20px;
}

.box-card2 {
  width: 480px;
  z-index: 1;
}
</style>
